import React, {PropTypes, Component} from 'react';
import { Menu, Icon, Switch, Button} from 'antd';
import {redirect} from "lib/utils";
import API,{GET_MENU,LOGOUT,GET_USER_INFO} from 'lib/api';
const SubMenu = Menu.SubMenu;
import './style.less';

import {menu} from './Menubars';

export default class Menubars extends Component{

    constructor(props){
        super(props);
        this.state = {
            theme: 'light',
            current: '1',
        }

    };


    componentDidMount() {
        // API.fetch(GET_MENU,{},resp =>{
        //
        //
        // });


    };


    toggleCollapsed = () => {
        this.setState({
            collapsed: !this.state.collapsed,
        });
    };

    handleMenuItem =(item, key, keyPath)=>{
        console.log(item, key, keyPath)
    };

    render(){

        return (
            <div className={`cmp-submenu ${this.state.collapsed?"clos":""}`}>

                <Button type="primary" className={`collapsed-btn ${this.state.collapsed?"cols-active":""}`}
                        onClick={this.toggleCollapsed}
                >
                    <Icon type={this.state.collapsed ? 'menu-unfold' : 'menu-fold'} />
                </Button>


                <Menu
                    defaultSelectedKeys={['1']}
                    defaultOpenKeys={['sub1']}
                    mode="inline"
                    theme="light"
                    onClick={this.handleMenuItem}
                    className={`mend-children ${this.state.collapsed?"clos-children":""}`}
                >


                    {
                        menu.map((item,idx)=>(
                            <SubMenu key={item.key} title={<span><Icon type={item.icon} /><span>{item.title}</span></span>}>
                                {
                                    item.children.map((v,k)=>(
                                        <Menu.Item key={v.key}  >{v.title}</Menu.Item>
                                    ))
                                }
                            </SubMenu>
                        ))
                    }

                    {/*<SubMenu key="sub01" title={<span><Icon type="appstore" /><span>活动管理</span></span>}>*/}
                        {/*<Menu.Item key="01" >轮播图查询</Menu.Item>*/}
                    {/*</SubMenu>*/}

                    {/*<SubMenu key="sub1" title={<span><Icon type="appstore" /><span>商品管理</span></span>}>*/}
                        {/*<Menu.Item key="1">商品列表</Menu.Item>*/}

                        {/*<Menu.Item key="3">商品类型</Menu.Item>*/}
                        {/*<Menu.Item key="4">商品分类</Menu.Item>*/}
                        {/*<Menu.Item key="5">商品评论</Menu.Item>*/}
                    {/*</SubMenu>*/}
                    {/*<SubMenu key="sub2" title={<span><Icon type="appstore" /><span>订单管理</span></span>}>*/}
                        {/*<Menu.Item key="6">订单列表</Menu.Item>*/}
                        {/*<Menu.Item key="7">支付单</Menu.Item>*/}
                        {/*<Menu.Item key="8">退货单</Menu.Item>*/}
                    {/*</SubMenu>*/}
                    {/*<SubMenu key="sub3" title={<span><Icon type="appstore" /><span>专题</span></span>}>*/}
                        {/*<Menu.Item key="9">专题活动</Menu.Item>*/}
                        {/*<Menu.Item key="10">限时抢购</Menu.Item>*/}
                        {/*<Menu.Item key="11">砍价活动</Menu.Item>*/}
                    {/*</SubMenu>*/}
                    {/*<SubMenu key="sub4" title={<span><Icon type="appstore" /><span>优惠券</span></span>}>*/}
                        {/*<Menu.Item key="12">优惠券列表</Menu.Item>*/}
                    {/*</SubMenu>*/}

                </Menu>
            </div>
        );
    }
}